<!--
 * @Description: 
 * @Version: 1.0
 * @Autor: laikt
 * @Date: 2020-12-30 16:41:52
 * @LastEditors: laikt
 * @LastEditTime: 2021-01-07 13:57:15
-->
<style lang="scss">
.scrollbar {
    .el-scrollbar__wrap {
        overflow: auto;
    }
}
</style>

<template>
    <el-scrollbar
        class="scrollbar"
        ref="scrollbar"
        v-bind="$attrs"
        v-on="$listeners"
    >
        <slot></slot>
    </el-scrollbar>
</template>

<script>
import {
    addResizeListener,
    removeResizeListener
} from 'element-ui/src/utils/resize-event'

export default {
    name: 'scrollbar',
    inheritAttrs: false,
    mounted() {
        const scrollbar = this.$refs.scrollbar
        addResizeListener(scrollbar.$el, scrollbar.update)
        this.$once('hook:beforeDestroy', () => {
            removeResizeListener(scrollbar.$el, scrollbar.update)
        })
    }
}
</script>
